var servicePane = {
  
  init : function () {    
    var list = document.getElementsByClassName("serviceList")[0], nodes = list.childNodes;
    
    translator.getServices({type : "*"}).forEach(function (service) {
      list.addService({
        id : service.meta.shortName,
        name : service.meta.name,
        icon : service.meta.icon || "",
        rating : service.meta.rating,
        version : service.meta.version,
        description : "Supports XX language pairs",
        disabled : service.meta.disabled
      });     
    });
    
    for(var i = 0;i < nodes.length;i++) {
      var rating = document.getAnonymousElementByAttribute(nodes[i], "class", "serviceRating");
      rating.select = function (e) {
        servicePane.save();
      }
    }    
  },
  
  save : function () {
    var nodes = document.getElementsByClassName("service"), output = {};
      
    for(var i = 0;i < nodes.length;i++) {
      var rating = document.getAnonymousElementByAttribute(nodes[i], "class", "serviceRating");
      
      output[nodes[i].getAttribute("serviceId")] = {
        rating : rating.actualRating,
        disabled : nodes[i].getAttribute("disabled") == "true" ? true : false
      };
    }
    document.getElementById("pref_services").value = Mozkit.json.encode(output);
  },
  
  
  serviceMenuInit : function (menu) {    
    var toggleDisabled = document.popupNode.disabled === "true" ? "Enable" : "Disable";
    document.getElementById("toggleDisabled").setAttribute("label", toggleDisabled);
  },  
  
  resetRating : function () {
    document.getAnonymousElementByAttribute(document.popupNode, "class", "serviceRating").reset();
    servicePane.save();
  },
  
  toggleDisabled : function () {   
    document.popupNode.disabled = document.popupNode.disabled == "true" ? false : true;
    this.save();
  },
  
  visitHomePage : function () {
    
  }
};
